import React, { Component, useState } from 'react';
import { connect, connectAdvanced } from 'react-redux';
import { Button, Modal, Form, Input, Radio, Select, message, Upload } from 'antd';
import action from '../../../store/action';
import { UploadOutlined } from '@ant-design/icons';
import { stand } from '../../view_public/Add_public';
import store from '../../../store';


const CollectionCreateForm = ({ visible, onCreate, onCancel }) => {
    const [form] = Form.useForm();
    const { Option } = Select;
    const normFile = e => {
        if (Array.isArray(e)) {
            return e;
        }
        return e && e.fileList;
    };

    const props = {
        name: 'file',
        action: 'http://www.bestzc.cn:8080/materials.web/common/api/uploadFile_notId',
        headers: {
            authorization: 'authorization-text',
        },
        onChange(info) {
            if (info.file.status !== 'uploading') {


                store.dispatch({
                    type: 'STANDARD_UPLOAD',
                    upload_pay: info.file.response.message,
                })

            }
            if (info.file.status === 'done') {
                message.success(`${info.file.name}上传成功`);
            } else if (info.file.status === 'error') {
                message.error(`${info.file.name} 上传失败`);
            }
        },
    };
    const {TextArea}=Input;
    return (
        <Modal
            visible={visible}
            title="增加测试标准"
            okText="提交"
            cancelText="取消"
            onCancel={onCancel}
            onOk={() => {
                form
                    .validateFields()
                    .then(values => {
                        form.resetFields();
                        onCreate(values);
                    })
                    .catch(info => {
                        console.log('Validate Failed:', info);
                    });
            }}
        >
            <Form
                form={form}
                layout="vertical"
                name="form_in_modal"
                initialValues={{
                    modifier: 'public',
                }}
            >
                <div className="add_flex">


                    <Form.Item
                        name="standardNo"
                        label="标准编号:"
                        rules={[
                            {
                                required: true,
                                message: '内容不能为空!',
                            },
                        ]}
                    // initialValue={data.standardNo}
                    >
                        <Input placeholder='请输入标准编号' />
                    </Form.Item>
                    <Form.Item name="name" label="标准名称:" rules={[
                        {
                            required: true,
                            message: '内容不能为空!',
                        },
                    ]}
                    // initialValue={data.name}
                    >
                        <Input type="textarea" placeholder='请输入标准名称' />
                    </Form.Item>
                </div>

                <div className='add_flex'>
                    <Form.Item name="temperature" label="适用条件:" rules={[
                        {
                            required: true,
                            message: '内容不能为空!',
                        },
                    ]}

                    >
                        <Select placeholder="选择">
                            <Option value='A'>常温</Option>
                            <Option value="B">高温</Option>
                            <Option value="C">低温</Option>
                        </Select>
                    </Form.Item>
                    <Form.Item name="remark" label="简介:">
                        <TextArea allowClear autoSize={true} />
                    </Form.Item>

                </div>

                <div className='add_flex'>
                    <Form.Item
                        name="standardFileUrl"
                        label="上传文件"
                        valuePropName="fileList"
                        getValueFromEvent={normFile}
                        rules={[
                            {
                                required: true,
                                message: '文件必传!',
                            },
                        ]}
                    >
                        <Upload {...props}>
                            <Button>
                                <UploadOutlined /> 上传文件
                         </Button>
                        </Upload>
                    </Form.Item>
                    <div></div>
                </div>

            </Form>
        </Modal>
    );
};

const CollectionsPage = (props) => {
    const [visible, setVisible] = useState(false);

    const onCreate = values => {
        setVisible(false);
        props.item(values)
    };
    return (
        <div style={{ marginBottom: 10 }}>
            <Button
                type="primary"
                onClick={() => {
                    setVisible(true);
                }}
                style={{ width: '100px' }}
            >
                添加
      </Button>
            <CollectionCreateForm
                visible={visible}
                onCreate={onCreate}

                onCancel={() => {
                    setVisible(false);
                }}
            />
        </div>
    );
};

class index extends React.Component {
    constructor() {
        super();
    }
    render() {
        return <CollectionsPage item={(val) => this.handelPost(val)} />
    }
    handelPost = (e) => {
        const list = {
            standardNo: e.standardNo,
            name: e.name,
            temperature: e.temperature,
            remark: e.remark,
            standardFileUrl: e.standardFileUrl[0].response.message
        }

        let code = sessionStorage.getItem('admin_key')


        this.$axios.post(`/manager/api/addStandardInfo?userCode=${code}`, list).then((res) => {

            if (res.status == 1) {
                this.$axios.get('/manager/api/pageGetStandardInfoList/0/9999').then((res) => {

                    if (res.status === 1) {
                        const { stand_get } = this.props;
                        let new_list = {};
                        [].push.apply(new_list, res.standardInfoList);
                        stand_get(new_list)
                    }
                }).catch((err) => {
                    console.log(err);
                })
            }
        }).catch((err) => {
            console.log(err);
        })
    }
}

export default connect(state => ({ ...state.custom }), action.custom)(index);